<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">	
	<title>CRM-contact</title>
	<%@ include file="../include/head.jsp" %>
	<meta charset="UTF-8">
	<title></title>
	
	<style type="text/css">
		
	
	</style>
</head>
<body class="crm">
	<jsp:include page="../include/top.jsp">
		<jsp:param value="contact" name="tag"/>
	</jsp:include>
	
	
	<div class="container-fluid" style="margin-left:130px;margin-top:-120px">
		<div class="row-fluid">
			<div class="span8">
				<div class="well screen">
					<div class="page-header header">

						<select id="type" name="type">
							<optgroup label="所有..."><option value="All">所有的联系人</option>
								<option value="Person">所有的个人</option>
								<option value="Company">所有的公司</option>
							</optgroup>
						</select>
					</div>
					
					<div class="live_search_spinner" behavior="spinner" id="parties_loading">
					  <div class="liner">
					    <h3>处理中...</h3>
					    <img src="../styles/img/indicator.gif" alt="wait">
					  </div>
					</div>
					
					<div class="main" id="main">
						<!--应该是用于显示提示信息，比如删除或修该成功-->
						<div class="alert alert-success" style="display:none">
							<a class="close" data-dismiss="alert" href="https://1343817168.workxp.info/contacts#">×</a>
							<span></span>
						</div>
						
						<!--  
						
						<div class="filter-desc">
							可以通过以下条件来过滤联系人:
						</div>
						
						<div class="meta">
							<ul class="nav nav-pills contact-filter">
							
								<li class="dropdown">
									<a class="dropdown-toggle" data-toggle="dropdown" href="serarch/contacts">
										名称<b class="caret"></b>
									</a>
									
									<ul class="dropdown-menu">
											<div class="dropdown-box">
												<form class="form-search contacts-search">
													<input type="text" class="input-small search-query" name="name">
													<button type="submit" class="btn" data-loading-text="处理中..">搜索</button>
												</form>
											</div>
									</ul>
								</li>
								
								<li class="dropdown">
									<a class="dropdown-toggle" data-toggle="dropdown" href="serarch/contacts">
										职位<b class="caret"></b>
									</a>
									
									<ul class="dropdown-menu">
											<div class="dropdown-box">
												<form class="form-search contacts-search">
													<input type="text" class="input-small search-query" name="title">
													<button type="submit" class="btn" data-loading-text="处理中..">搜索</button>
												</form>
											</div>
									</ul>
							  </li>
							<li class="dropdown">
								<a class="dropdown-toggle" data-toggle="dropdown" href="serarch/contacts">
									邮箱<b class="caret"></b>
								</a>
								
								<ul class="dropdown-menu">
										<div class="dropdown-box">
											<form class="form-search contacts-search">
										<input type="text" class="input-small search-query" name="ContactEmail">
												<button type="submit" class="btn" data-loading-text="处理中..">搜索</button>
									  </form>
										</div>
								</ul>
							  </li>
						<li class="dropdown">
							<a class="dropdown-toggle" data-toggle="dropdown" href="serarch/contacts">
								电话<b class="caret"></b>
							</a>
							
							<ul class="dropdown-menu">
									<div class="dropdown-box">
										<form class="form-search contacts-search">
											<input type="text" class="input-small search-query" name="ContactPhone">
											<button type="submit" class="btn" data-loading-text="处理中..">搜索</button>
										</form>
									</div>
							</ul>
						  </li>
						  
						<li class="dropdown">
							<a class="dropdown-toggle" data-toggle="dropdown" href="serarch/contacts">
								地址<b class="caret"></b>
							</a>
							<ul class="dropdown-menu">
									<div class="dropdown-box">
										<form class="form-search contacts-search">
											<input type="text" class="input-small search-query" name="ContactAddress">
											<button type="submit" class="btn" data-loading-text="处理中..">搜索</button>
										</form>
									</div>
							</ul>
						  </li>
						  
						<li class="dropdown">
							<a class="dropdown-toggle" data-toggle="dropdown" href="serarch/contacts">
								背景信息<b class="caret"></b>
							</a>
							
							<ul class="dropdown-menu">
									<div class="dropdown-box">
										<form class="form-search contacts-search">
											<input type="text" class="input-small search-query" name="others">
											<button type="submit" class="btn" data-loading-text="处理中..">搜索</button>
										</form>
									</div>
							</ul>
						  </li>
						  
						<li class="dropdown">
							<a class="dropdown-toggle" data-toggle="dropdown" href="serarch/contacts">
								网站<b class="caret"></b>
							</a>
							
							<ul class="dropdown-menu">
									<div class="dropdown-box">
										<form class="form-search contacts-search">
											<input type="text" class="input-small search-query" name="ContactWebsite">
											<button type="submit" class="btn" data-loading-text="处理中..">搜索</button>
										</form>
									</div>
							</ul>
						  </li>
						<li class="dropdown">
							<a class="dropdown-toggle" data-toggle="dropdown" href="serarch/contacts">
								IM<b class="caret"></b>
							</a>
							<ul class="dropdown-menu">
									<div class="dropdown-box">
										<form class="form-search contacts-search">
											<input type="text" class="input-small search-query" name="ContactIm">
											<button type="submit" class="btn" data-loading-text="处理中..">搜索</button>
										</form>
									</div>
							</ul>
						  </li>
					</ul>
				</div>
				
			<div class="filter-container" data="{}"></div>
			<div class="filter-template" data="">
				<a class="filter" name="" data="" href="serarch/contacts"><strong></strong></a>
			</div>
			-->
	<div id="table">
	
		<form accept-charset="UTF-8" action="https://1343817168.workxp.info/contacts/batch_action" class="simple_form form-inline" data-remote="true" id="batch_form" method="post" novalidate="novalidate">
		
			<input type="hidden" name="tag_id" value="" id="tag_id">
			<input type="hidden" name="contact_import_id" value="" id="contact_import_id">
			<input type="hidden" name="check_all_contacts" id="check_all_contacts">
			<input type="hidden" name="per_page" id="per_page" value="30">
			<input type="hidden" name="contact_num" id="contact_num" value="1">
			<input type="hidden" name="add_tag" id="add_tag_hidden">
			<input type="hidden" name="update_access_policy" id="update_access_policy_hidden">
			<input type="hidden" name="destroy" id="destroy_hidden">
			<input type="hidden" name="send_email" id="send_email_hidden">
			
			<div id="contact_actions_container">
			
				<div id="selection_tip">
					<div id="select_all_contacts_container" style="display:none">
					</div>
					<h5 id="selected_all_contacts" style="display:none"></h5>
				</div>
				
				<div class="selector">
					<span id="selection_summary"></span>
					<a href="javascript:;" id="toggle_link">全选</a>
				</div>
				
				<div id="party_selection_controls">
				
					<div id="summaries">
						勾选联系人后可以批量修改访问权限和删除
					</div>
					
					<div id="contact_actions">
						<a id="update_access_policy_link" data_action="update_access_policy" class="action">修改访问权限</a>
						<a id="destroy_link" data_action="destroy" class="destroy action">删除</a>
					</div>
					
				</div>
				
				<div id="party_selection_activities" style="display:none">
					
					<div id="confirm_update_access_policy" class="display_none confirm_action">
						
						<div class="message">
							<h4>谁可以看见这些联系人？</h4>
						</div>
						
						<div class="actions">
							
							 <div id="select_access_policy_for_Contact_" class="select_access_policy">
			 
							<input type="hidden" id="myview" value="${contact.view }">
							<div class="radio scope activated">
								<input checked="checked" id="person_access_policy_attributes_scope_everyone" name="contact.view" type="radio" value="a"> 所有同事
							</div>
							<div class="radio scope ">
								<input id="person_access_policy_attributes_scope_owner" name="contact.view" type="radio" value="m:${sessionScope.user.id }"> 只有我能看见
							</div>
							<div class="radio scope ">
								<input id="person_access_policy_attributes_scope_namedgroup" name="contact.view" type="radio" value="NamedGroup"> 选择一个组...
							<div class="editor">
						  	<select class="named_group" id="group" name="person[access_policy_attributes][group_id]">
						  		<option value="">选择一个组</option>
								<c:forEach items="${groups }" var="group">
									<option value="m:${sessionScope.user.id},g:${group.id }">${group.groupname }</option>
								</c:forEach>
								
							</select> 
							</div>
							</div>
						<div class="radio scope">
							<input id="person_access_policy_attributes_scope_adhocgroup" name="contact.view" type="radio" value="AdhocGroup"> 选择同事...
							<div class="editor">
					  		<select class="new_adhoc_group_member" id="member" name="view">
					  		<option value="">选择一个同事</option>
					  			<c:forEach items="${users }" var="user">
					  				<c:if test="${user.id != sessionScope.user.id}">
					  					<option value="m:${sessionScope.user.id},u:${user.id}">${user.username }</option>
					  				</c:if>
					  			</c:forEach>
						  		
							</select> 
							</div>
						</div>
						</div>

							<p class="submit">
								<button id="submit_update_access_policy" type="button" class="btn btn-warning" data-loading-text="处理中..">
									<li class="icon-lock icon-white"></li> 修改访问权限
								</button>
								<!-- <a class="btn" href="https://1343817168.workxp.info/contacts#" onclick="toggle_action(update_access_policy); return false;">取消</a> -->
							</p>
							
							
							<script>
							var container = $('#select_access_policy_for_Contact_');
							$('.scope input[type=radio]', container).live('click', function(event) {
							var activated = $(event.target).parent();
							$('.scope.activated', container).removeClass('activated');
							activated.addClass('activated');
								changePermission();
						  });
							
							$(document).ready(function(){
								
								$("#group").change(function() {
									$("#person_access_policy_attributes_scope_namedgroup").attr("value",$("#group").val());
								});
								
								$("#member").change(function() {
									$("#person_access_policy_attributes_scope_adhocgroup").attr("value",$("#member").val());
								});
							});
				
						</script>
							
							
						</div>
					</div>
					
					<div id="confirm_destroy" class="display_none confirm_action">
						<div class="message">
				      <h4>您确定要删除这些联系人吗？</h4>
				    </div>
						<div class="actions submit">
							<button id="submit_destroy" type="button"  class="btn btn-danger" data-loading-text="处理中.." >
								<li class="icon-trash icon-white"></li> 我确定要删除这些联系人
							</button>
							<a class="btn" href="javascript:;" onclick="toggle_action('destroy');">取消</a>
						</div>
					</div>
				</div>
			</div>
			
			<!--用于显示联系人-->
			<table class="table crm-table" id="contacts">
				<thead>
					
					<c:choose>
						<c:when test="${empty contacts}">
							<h2 style="color:red ">暂无联系人,请<a href="<%=basePath %>contact/newcontact.action">添加联系人</a>或<a href="<%=basePath %>/contact/newcompany.action">添加公司</a></h2>
						</c:when>
						
						<c:otherwise>
							<c:forEach items="${contacts}" var="contact">
								<c:if test="${contact.enable }">
								<tr id="tr${contact.id }">
								<td width="20px">
									<input id="id_" name="ids" type="checkbox" value="${contact.id }"></td>
								<td width="35px">
									<a href="#" data-id="774147" class="quick-view">
										<c:choose>
											<c:when test="${contact.companyname == null }">
												<span style="display: inline-block;border:1px solid #CCCCCC;background: url(${basePath}/img/workxp_sprites.png) no-repeat 0px -148px transparent; width: 32px; padding-top: 32px;font-size:1px">
											</c:when>
											<c:otherwise>
												<span style="display: inline-block;border:1px solid #CCCCCC;background: url(${basePath}/img/workxp_sprites.png) no-repeat -112px -148px transparent; width: 32px; padding-top: 32px;font-size:1px">
											</c:otherwise>
										</c:choose>
										
										</span>
									</a>
								</td>
								<td width="50%">
									<h3>
										<a href="show.action?id=${contact.id }">${contact.name }</a>
										
										<span></span>
									</h3>
									<div class="info">
										<c:forEach items="${contact.mailList }" var="mail">
											<a href="#">${mail.mail }</a>
										</c:forEach>
										
										
									</div>
								</td>
								<td class="description">
									<h3>
									</h3>
									<div>
									</div>
								</td>
								</tr>
								</c:if>
							</c:forEach>
						</c:otherwise>
					</c:choose>
					
				</thead>
			</table>
		</form>			
	</div>

<!--  -->
<script type="text/javascript" charset="utf-8">
	$(document).ready(function() {
		/*
		$.get('/contacts/tags', function(data) {
			$('#tags_container').html(data);
		}, 'html');
		
		$.get('/contacts/recent_imports', function(data) {
			$('#recent_imports').html(data);
			$("#recent_imports").has("div.title").addClass("well");
		}, 'html');
		
		$.get('/contacts/tags.json', function(data) {
			$('#tag').typeahead({ source: data })
		});
		*/
		init_contacts_action();
		
		//ContactQuickShow.init();
		//new ContactsFilter();
		
		/*
		$('#type').change(function() {
			$('body').addClass('loading');
			var filters = $(".filter-container").data("filters");
			var filter_str = '';
			if(filters) {
				filter_str = $.param(filters);
			}
			$.get('/contacts?filter=on&page=1&' + filter_str, {type: this.value}, updateContacts, 'html');
		});
		
		$("a.export").click(function(e) {
			e.preventDefault();
			var url = $(this).attr("href");
			window.location.href = url + '?c=' + $("#contact_num").val();
		});
		*/
	});
</script>


					</div>
				</div>
			</div>
			<div class="span4 sidebar">
				<div class="well">
					<ul id="inout">
						<li><a href="add.action?t=contact">添加联系人</a></li>
						<li><a href="add.action?t=company">添加公司</a></li>
						
					</ul>
					
					<ul>
						<li><a href="import.action?f=csv">上传CSV文件</a></li>
						<p>大部分数据库和表格程序都可以导出CSV格式的文件</p>
						
						<li><a href="import.action?f=excel">上传Excel文件</a></li>
						<p>目前我们只支持微软老版本的Excel格式，还不支持.xlsx格式，请在导入前转成.xls格式</p>
					</ul>
					
				</div>
				<div id="recent_imports" class="">
					<ul class="unstyled"></ul>
				</div>
				<div id="tags_container">

					<div id="tags_combination" style="display:none" class="well">
						<div class="title">
							<span style="float:right;">
								
							</span>
							<i class="icon-tags"></i> 多选标签
						</div>
						<div style="padding:2px 5px">点击另一个标签进行过滤</div>
						
						<table class="table crm-table tags">
								<tbody>
									<tr>
										<td style="width:12px;"><strong>N</strong></td>
										<td>
											<a class="label" href="https://1343817168.workxp.info/contacts/tagged_with?id=1508">内部通讯录</a>
										</td>
									</tr>
								</tbody>
						</table>
					</div>
				</div>

				</div>
			</div>
		</div>	
		
		<script type="text/javascript">
			$(document).ready(function(){ 
				$("#submit_destroy").click(function() {
					var inputs = $("input[type='checkbox']");
					var ids = "";
					
					for(var i = 0;i < inputs.length;i++) {
						
						if($(inputs[i]).attr("checked") == 'checked') {
							ids = ids + $(inputs[i]).val() + ",";
						}
						
					}
					
					/**/
					$.post("del.action",{"idArr":ids},function() {
						for(var i = 0;i < inputs.length;i++) {
							
							if($(inputs[i]).attr("checked") == 'checked') {
								var id = $(inputs[i]).val();
								$("#tr"+id).fadeOut();
							}
							
						}
					});
					
					
				});
			});
			
		
		</script>
		
		
</body>
</html>
 